<template>
  <div class="edit">
    <h2 class="h1" style="position: relative; top: -13px; left: 10px">
      编辑课程
    </h2>
    <el-form ref="form" :model="sizeForm" label-width="80px" size="mini">
      <el-form-item label="课程编号" prop="courseId">
        <el-input
          v-model.number="sizeForm.courseId"
          autocomplete="off"
          style="width: 210px"
          :disabled="true"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="课程名称"
        prop="courseName"
        :rules="[{ required: true, message: '课程名称不能为空' }]"
      >
        <el-input
          v-model.number="sizeForm.courseName"
          autocomplete="off"
          style="width: 210px"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="班级编号"
        prop="classId"
        :rules="[{ required: true, message: '班级不能为空' }]"
      >
        <el-input
          v-model.number="sizeForm.classId"
          autocomplete="off"
          style="width: 210px"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="班级人数"
        prop="classNumber"
        :rules="[{ required: true, message: '班级人数不能为空' }]"
      >
        <el-input
          v-model.number="sizeForm.classNumber"
          autocomplete="off"
          style="width: 210px"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="教师编号"
        prop="teacherId"
        :rules="[{ required: true, message: '教师编号不能为空' }]"
      >
        <el-input
          v-model.number="sizeForm.teacherId"
          autocomplete="off"
          style="width: 210px"
        ></el-input>
      </el-form-item>
      <el-form-item size="large">
        <img
          src="../msg/3.png"
          style="width: 30px; position: relative; top: 12px; left: -30px"
        />
        <el-button type="primary" @click="onSubmit" size="mini"
          >立即修改</el-button
        >
        <el-button @click="giveUp" size="mini">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { serverAddress } from "../js/config";
import axios from "axios";
export default {
  name: "Edit",
  data() {
    return {
      sizeForm: {
        courseId: "",
        courseName: "",
        teacherId: "",
        teacherName: "",
        classId: "",
        classNumber: "",
      },
    };
  },
  methods: {
    OldEditInformation(data) {
      console.log(data);
      this.sizeForm.classId = data.course.classId;
      this.sizeForm.courseId = data.course.CourseId;
      this.sizeForm.classNumber = data.course.classNumber;
      this.sizeForm.courseName = data.course.courseName;
      this.sizeForm.teacherId = data.course.teacherId;
      this.sizeForm.teacherName = data.teacherName;
    },
    onSubmit() {
      let formObj = {
        courseId: this.sizeForm.courseId,
        courseName: this.sizeForm.courseName,
        classId: this.sizeForm.classId,
        classNumber: this.sizeForm.classNumber,
        teacherId: this.sizeForm.teacherId,
      };
      axios({
        /* url:`${serverAddress}/courseManage/updetaCourse`, */
        url: "https://mock.apifox.com/m2/3662090-0-default/143566020",
        method: "POST",
        data: formObj,
      })
        .then((response) => {
          if (response.data.code === 1) {
            alert("修改成功！");
            this.$parent.refresh();
            console.log(response.data);
          } else {
            console.log(response.data.msg);
          }
        })
        .catch((error) => {
          console.log("网络错误,修改失败");
        });
      console.log("submit!");
    },
    giveUp() {
      this.sizeForm.courseId = "";
      this.sizeForm.courseName = "";
      this.sizeForm.teacherId = "";
      this.sizeForm.teacherName = "";
      this.sizeForm.classId = "";
      this.sizeForm.classNumber = "";
    },
  },
};
</script>
